<template>

  <n-layout class="root">
    <!--    头-->
    <page-header :title="title" />
    <!--    主体表格-->
    <page-main />
    <!--    底-->
    <page-footer />
  </n-layout>

</template>

<script>
import { defineComponent } from "vue";
import PageHeader from "@/components/template/childs/pageHeader.vue";
import PageMain from "@/components/template/childs/pageMain.vue";
import PageFooter from "@/components/template/childs/pageFooter.vue";
export default defineComponent({
  components: {
    PageHeader,
    PageMain,
    PageFooter,
  },
  props: {
    title:{
      type:String,
      default:'title'
    }
  },
  setup(props) {
    // 标题
    const title = props.title;

    return {
      title,
    };
  }
});
</script>

<style>
/*根*/
.root{
//border: 1px solid red;
  height: 100%;
}
/*头部*/
.top{
//border: 1px solid black;
  height: 10%;
  font-size: 20px;
  font-weight: bold;
  padding-top: 15px;
}
/*主体*/
.content{
//border: 1px solid black;
  min-height: 75%;
}
/*底部*/
.foot{
//border: 1px solid black;
  height: 15%;
  text-align: center;
}
</style>